/*
 * @Author: huangtianyang 916072572@qq.com
 * @Date: 2023-11-21 17:45:12
 * @LastEditors: huangtianyang
 * @LastEditTime: 2024-01-23 11:40:29
 * @FilePath: \cxl-driving-training\src\views\trainingGround\subjectThree\index.ts
 */
import { BaseData, BaseMethod } from '@/utils/basc-data'
import { tableConfig } from './config'
import { reactive } from 'vue'
import router from '@/router'
import { ElMessage, FormInstance } from 'element-plus'
import {
    importSiteThree,
    trainSiteAdd,
    trainSiteDetailed,
    trainSiteEdit,
    trainSiteList,
    trainSiteListInterface
} from '@/apis/trainSite'
import { CreateXMLHttpRequest } from '@/utils'

export default class SubjectThreeData extends BaseData implements BaseMethod {
    dialog = reactive({
        visible: false,
        title: '新增科目三',
        width: '600px',
        siteType: 'create'
    })
    dialogForm = reactive({
        name: '',
        adcode: '',
        lat: '',
        lng: '',
        detailed: '',
        id: ''
    })
    rules = {
        name: [{ required: true, message: '请输入场地名', trigger: 'blur' }],
        detailed: [{ required: true, message: '请输入所在地址', trigger: 'blur' }]
    }
    drawerData = reactive({
        visible: false,
        address: '',
        lat: '',
        lng: ''
    })
    searchData = {
        name: '',
        addressDetail: '',
        status: ''
    }
    constructor() {
        super(tableConfig)
        this.getData()
    }
    getData = (arg?: any) => {
        const params: trainSiteListInterface = {
            current: this.pageData.pagination.pageNo,
            size: this.pageData.pagination.pageSize,
            siteCategory: 3
        }

        if (this.searchData.name) {
            params.name = this.searchData.name
        }
        if (this.searchData.addressDetail) {
            params.addressDetail = this.searchData.addressDetail
        }
        if (this.searchData.status !== '' && this.searchData.status !== '-1') {
            params.disable = Number(this.searchData.status)
        }

        trainSiteList(params).then(res => {
            if (Number(res.data.code) === 200) {
                this.pageData.table.data.length = 0
                this.pageData.pagination.total = res.data.result.total
                const arr: any[] = res.data.result.records
                arr.forEach((element: any) => {
                    element.status = Number(element.disable) === 0 ? true : false
                    this.pageData.table.data.push(element)
                })
            }
        })
    }
    onSearch = (arg?: any) => {
        console.log(arg)
        this.searchData = arg
        this.getData()
    }
    onReset = (arg?: any) => {
        this.searchData = {
            name: '',
            addressDetail: '',
            status: ''
        }
        this.getData()
    }
    onPaginationChange = (arg?: any) => {
        this.pageData.pagination.pageNo = arg
        this.getData()
    }
    onPaginationSize = (arg?: any) => {
        this.pageData.pagination.pageNo = 1
        this.pageData.pagination.pageSize = arg
        this.getData()
    }
    onOperation = (arg?: any) => {
        const { type, data } = arg
        console.log(type)
        if (type === 'create') {
            this.dialog.visible = true
            this.dialog.title = '新增科目三训练场'
            this.dialog.siteType = 'create'
            this.dialogForm.detailed = ''
            this.dialogForm.adcode = ''
            this.dialogForm.lat = ''
            this.dialogForm.lng = ''
            this.dialogForm.name = ''
            this.dialogForm.id = ''
        } else if (type === 'edit') {
            this.dialog.title = '编辑科目三训练场'
            this.dialog.siteType = 'edit'
            trainSiteDetailed(data.id).then(res => {
                if (Number(res.data.code) === 200) {
                    this.dialogForm.detailed = res.data.result.addressDetail
                    this.dialogForm.adcode = res.data.result.regionId
                    this.dialogForm.lat = res.data.result.lat
                    this.dialogForm.lng = res.data.result.lng
                    this.dialogForm.name = res.data.result.name
                    this.dialog.visible = true
                    this.dialogForm.id = res.data.result.id
                }
                console.log(this.dialogForm)
            })
        } else if (type === 'import') {
            console.log(data[0])
            importSiteThree(data[0]).then(res => {
                if (Number(res.data.code) === 200) {
                    ElMessage.success('上传成功')
                    this.getData()
                }
            })
        } else if (type === 'download') {
            //科二训练场：trainSiteTwo, 科三训练场：trainSiteThree, 驾校教练：schoolCoach;
            const url = import.meta.env.VITE_HOST + '/api/system/template/download/trainSiteThree'

            CreateXMLHttpRequest(url, '科目三训练场模板')
        }
    }
    onClickInput = () => {
        this.drawerData.visible = true
    }
    onDrawerClose = () => {
        this.drawerData.visible = false
    }
    onMapChange = (res: any) => {
        this.drawerData.visible = false
        this.dialogForm.detailed = res.address
        this.dialogForm.adcode = res.adcode
        this.dialogForm.lat = res.lat
        this.dialogForm.lng = res.lng
        console.log(res)
    }
    //监听弹窗关闭
    onCloseDialog = (formEl: FormInstance | undefined) => {
        if (!formEl) return
        formEl.resetFields()
        this.dialog.visible = false
    }
    //监听弹窗点击确定按钮
    submitForm = async (formEl: FormInstance | undefined) => {
        if (!formEl) return
        await formEl.validate((valid, fields) => {
            if (valid) {
                console.log('submit!', this.dialogForm, this.dialog.siteType)
                if (this.dialogForm.adcode) {
                    if (this.dialog.siteType === 'create') {
                        trainSiteAdd({
                            name: this.dialogForm.name,
                            regionId: this.dialogForm.adcode,
                            lat: this.dialogForm.lat.toString(),
                            lng: this.dialogForm.lng.toString(),
                            addressDetail: this.dialogForm.detailed,
                            siteCategory: 3
                        }).then(res => {
                            if (Number(res.data.code) === 200) {
                                this.dialog.visible = false
                                ElMessage.success('新增成功')
                                this.getData()
                            }
                        })
                    } else {
                        trainSiteEdit({
                            name: this.dialogForm.name,
                            regionId: this.dialogForm.adcode,
                            lat: this.dialogForm.lat.toString(),
                            lng: this.dialogForm.lng.toString(),
                            addressDetail: this.dialogForm.detailed,
                            siteCategory: 3,
                            id: this.dialogForm.id
                        }).then(res => {
                            if (Number(res.data.code) === 200) {
                                this.dialog.visible = false
                                ElMessage.success('修改成功')
                                this.getData()
                            }
                        })
                    }
                } else {
                    ElMessage.error('请输入场地地址')
                }
            } else {
                console.log('error submit!', fields)
            }
        })
    }
}
